import React from 'react'
import PropTypes from 'prop-types'
import moment from 'moment'
import { Table, Modal, Button, Popconfirm } from 'antd'
import classnames from 'classnames'
import { Link } from 'react-router-dom'
import queryString from 'query-string'
import styles from './CreatorList.less'

const { confirm } = Modal

const CreatorList = ({ onSubmitItem, location, ...tableProps }) => {
  location.query = queryString.parse(location.search)

  const columns = [
    {
      title: '编号',
      dataIndex: 'id',
      key: 'id',
      width: 150,
    }, {
      title: '标题',
      dataIndex: 'name',
      key: 'name',
      width: 200,
    }, {
      title: '项目类型',
      dataIndex: 'type',
      key: 'type',
      width: 150,
      render: text => text === '0' ? '数据协同' : '文件协同',
    }, {
      title: '协同人数',
      dataIndex: 'sum',
      key: 'sum',
      width: 100,
    }, {
      title: '提交人数',
      dataIndex: 'count',
      key: 'count',
      width: 100,
    }, {
      title: '项目状态',
      dataIndex: 'status',
      key: 'status',
      width: 100,
      render: text => text === '0' ? '进行中' : '已完结',
    }, {
      title: '描述',
      dataIndex: 'description',
      key: 'description',
      width: 300,
    }, {
      title: '截止日期',
      dataIndex: 'deadline',
      key: 'deadline',
      width: 150,
      render: text => moment(text).format('YYYY-MM-DD'),
    }, {
      title: '创建时间',
      dataIndex: 'createTime',
      key: 'createTime',
      width: 200,
      render: text => moment(text).format('YYYY-MM-DD HH:mm:ss'),
    }, {
      title: '提交状态',
      dataIndex: 'content',
      key: 'content',
      width: 150,
      render: (text) => text ? '已提交' : '未提交',
    }, {
      title: '创建人',
      dataIndex: 'userName',
      key: 'userName',
      width: 150,
    }, {
      title: '操作',
      key: 'operation',
      width: 150,
      fixed: 'right',
      render: (text, record) => {
        return (<div>
          <Button type="primary" disabled={record.status === '1'} onClick={() => onSubmitItem(record)} >提交数据</Button>
        </div>)
      },
    },
  ]

  return (
    <div>
      <Table
        {...tableProps}
        className={classnames({ [styles.table]: true })}
        bordered
        scroll={{ x: 1250 }}
        columns={columns}
        simple
        rowKey={record => record.id}
      />
    </div>
  )
}

CreatorList.propTypes = {
  onSubmitItem: PropTypes.func,
  location: PropTypes.object,
}

export default CreatorList
